/**
 * @Description:登录主入口
 * @author 云离
 * @date: 2018/12/28
 */
import React, { Component } from 'react'
import {message, Button, Modal, Input, Form } from 'antd'
import axios from "../../../../apis/api";
import qs from "qs";
import {connect} from "react-redux";
import md5 from "md5-node";

const mapStateToProps = (state, ownProps) => {
    return {
        user: state.main.user
    }
}

const mapDispatchToProps = (dispatch) => {
    return {
    }
}

const formItemLayout = {
    labelCol: {
        xs: { span: 14 },
        sm: { span: 8 },
    },
    wrapperCol: {
        xs: { span: 14 },
        sm: { span: 8 },
    },
};

const tailFormItemLayout = {
    wrapperCol: {
        xs: {
            span: 24,
            offset: 0,
        },
        sm: {
            span: 16,
            offset: 8,
        },
    },
};

class PayPw extends Component {

    state = {
        loading: false,
    }

    handleSubmit = (e) => {
        e.preventDefault();
        this.props.form.validateFields(async (err, values) => {
            if (!err) {
                const {oldPw, newPw, newPw2} = values
                if (newPw !== newPw2) {
                    message.error('新密码与确认密码不同')
                    return
                }
                this.setState({loading: true})
                try {
                    const result = await axios.get(`/channel/businessInfo/checkPassword?oldPassword=${oldPw}&password=${md5(oldPw)}`)
                    if (!result) {
                        message.error('旧密码输入错误')
                        this.setState({loading: false})
                        return
                    }
                    const resetResult = await axios.post('/channel/businessInfo/resetBusinessPayPwd', qs.stringify({
                        oldPassword: md5(oldPw),
                        newPassword: md5(newPw)
                    }))
                    if (resetResult.code === 0) {
                        message.success('操作成功')
                    } else {
                        message.error(resetResult.msg)
                    }
                    this.setState({loading: false})
                    this.props.form.resetFields();
                }catch (e) {
                    this.setState({loading: false})
                    console.log(e)
                }
            }
        });
    }

    render() {
        const { getFieldDecorator } = this.props.form
        const { user } = this.props
        const {loading} = this.state

        return (
            <div>
                <Form {...formItemLayout} onSubmit={this.handleSubmit}>
                    <Form.Item label={'登录名称'}>
                        {getFieldDecorator('loginName', {
                            initialValue: user.loginName,
                        })(
                            <Input disabled/>
                        )}
                    </Form.Item>
                    <Form.Item label={'旧密码'}>
                        {getFieldDecorator('oldPw', {
                            rules: [{ required: true, message: '请输入旧密码'}],
                        })(
                            <Input type="password" placeholder='请输入旧密码' autoComplete="off"/>
                        )}
                    </Form.Item>
                    <Form.Item label={'新密码'}>
                        {getFieldDecorator('newPw', {
                            rules: [{ required: true, message: '请输入新密码'}],
                        })(
                            <Input type="password" placeholder='请输入新密码' autoComplete="off"/>
                        )}
                    </Form.Item>
                    <Form.Item label={'确认密码'}>
                        {getFieldDecorator('newPw2', {
                            rules: [{ required: true, message: '请输入确认密码'}],
                        })(
                            <Input type="password" placeholder='请确认密码' autoComplete="off"/>
                        )}
                    </Form.Item>
                    <Form.Item {...tailFormItemLayout}>
                        <Button type="primary" htmlType="submit"  loading={loading}>
                            保存
                        </Button>
                    </Form.Item>
                </Form>
            </div>

        )
    }
}

export default connect(mapStateToProps,mapDispatchToProps)(Form.create()(PayPw))
